<template>
  <div class="com">
    <Comment
      :commentList="commentList"
      @doSend="sendContent"
      @doChidSend="childSend"
      :commentNum="commentList.length"
      :avatar="require('../../assets/avator/'+userDetail.avator)"
    />
  </div>
</template>

<script>
import Comment from '../../components/base/Comment.vue'
import { mapState,mapActions,mapMutations } from 'vuex';
import {AddCommentOne,AddCommentTwo} from '../../request/api'
export default {
  data(){
    return{
        // 即将发表评论的用户头像
        avatar:'',
        params:{
          blogid:this.$route.query.blogid,
          content:'',
          targetUserid:null,
          whichCommentid:null,
        },
        comments:[],
    }
  },
  components:{
      Comment
  },
  computed:{
      ...mapState({
        userDetail:state=>state.userInfo.userDetail,
        commentList:state=>state.comment.commentList
      })
  },
  methods:{
    ...mapActions({
        getFetchCommentList:'comment/getFetchCommentList',
        asyncChangeIsShowToast:'toastStatus/asyncChangeIsShowToast',
    }),
    ...mapMutations({
        
    }),
    // 发送一级评论
    async sendContent(content){
      // 需要的参数：blogid，content
      this.params.content = content
      let res = await AddCommentOne(this.params)
      if(res.data.state == 200){
        // 发布成功
        this.asyncChangeIsShowToast({
          type:'success',
          msg:'评论成功'
        })
      }else{
        this.asyncChangeIsShowToast({
          type:'error',
          msg:'发生错误！'
        })
      }
      // 重新获取评论列表
      this.getFetchCommentList(this.params)
    },
    // 发送二级评论
    async childSend(content,targetuserid,whichcommentid){
      // 内容--对象id--哪条评论的id---blogid
      this.params.content = content
      this.params.targetUserid = targetuserid
      this.params.whichCommentid = whichcommentid
      this.params.blogid = this.$route.query.blogid
      let res =await AddCommentTwo(this.params)
      if(res.data.state == 200){
        // 发布成功
        this.asyncChangeIsShowToast({
          type:'success',
          msg:'评论成功'
        })
      }else{
        this.asyncChangeIsShowToast({
          type:'error',
          msg:'发生错误！'
        })
      }
      // 重新获取评论列表
      this.getFetchCommentList(this.params)
    }
  },
  mounted(){
    this.getFetchCommentList(this.params)
    // this.avatar = require('../../assets/avator/admin.jpg')
    // console.log("detailComment:",this.userDetail)
    // console.log("detailComment:",this.commentList)
  }
}
</script>

<style scoped>

</style>
